import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
// import App from './App';
// import Test from './test/Test'
import * as serviceWorker from './serviceWorker';

// ReactDOM.render(<App />, document.getElementById('root'));
// ReactDOM.render(<Test />, document.getElementById('root'));

// function Welcome(props){
//     return <h1>hello,{props.name}</h1>
// }
// const person = {
//     name:'aaa',
//     age:20
// }
// const element = <h1>hello {getName(person)}</h1>
// function App(){
//     return (
//         <div>
//             <Welcome name="aaa" />
//             <Welcome name="bbb" />
//             <Welcome name="ccc" />          
//         </div>
//     )
// }
// ReactDOM.render(
//     // element,
//     <App />,
//     document.getElementById('root')
// )
class Clock extends React.Component {
    constructor(props){
        super(props)
        this.state = {
            date:new Date()
        }
    }
    componentDidMount(){
        this.timerID = setInterval(
            ()=>this.tick(),
            1000
        )
    }
    componentWillUnmount(){
        clearInterval(this.timerID)
    }
    tick(){
        this.setState({
            date:new Date()
        })
    }
    render() {
        return (
            <div>
                <h1>Hello,world</h1>
                <h2>It is {this.state.date.toLocaleTimeString()}.</h2>
            </div>
        )
    }
}

ReactDOM.render(<Clock />,document.getElementById('root'))

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();
